<template>
	<view class="common-list uflex animated fadeInUpBig fast">
		<view class="common-list-l"><image :src="item.userpic" mode="widthFix" lazy-load></image></view>
		<view class="common-list-r">
			<view class="">
				<view class="uflex-a-j_sbc">
					<view class="uflex-a-j_fsc">
						{{ item.username }}
						<tag-sex-age :sex="item.sex" :age="item.age"></tag-sex-age>
					</view>
					<view class="icon iconfont" :class="{ 'icon-zengjia': !isguangzhu }" @tap="guanzhu">{{ isguangzhu ? '已关注' : '关注' }}</view>
				</view>
				<view class="common-list-r-time">26天前</view>
			</view>
			<view>{{ item.title }}</view>
			<view class="uflex-a-j_c" style="flex-direction: column;">
				<!-- 图片 -->
				<block v-for="(pic, index) in item.morepic" :key="index">
					<image style="padding: 20upx 0;" :src="pic" mode="widthFix" lazy-load @tap="imgdetail(index)"></image>
				</block>
				<!-- 视频 -->
				<template v-if="item.video">
					<view class="common-list-play icon iconfont icon-bofang"></view>
					<view class="common-list-playinfo">
						<text>{{ item.video.looknum }}</text>
						次播放
						<text>{{ item.video.long }}</text>
					</view>
				</template>
				<!-- 分享 -->
				<view v-if="item.share" class="common-list-share uflex-a-j_fsc">
					<image :src="item.share.titlepic" mode="widthFix" lazy-load></image>
					<view class="title">{{ item.share.title }}</view>
				</view>
			</view>
			<view class="uflex-a-j_sbc">
				<view>{{ item.path }}</view>
				<view class="uflex-a-j_fsc">
					<view class="icon iconfont icon-zhuanfa">
						<text>{{ item.sharenum }}</text>
					</view>
					<view class="icon iconfont icon-pinglun1">
						<text>{{ item.commentnum }}</text>
					</view>
					<view class="icon iconfont icon-dianzan1">
						<text>{{ item.goodnum }}</text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
import tagSexAge from '../common/tag-sex-age.vue';
export default {
	props: {
		item: Object
	},
	data() {
		return {
			isguangzhu: this.item.isguangzhu
		};
	},
	methods: {
		guanzhu() {
			if (this.isguangzhu) {
				this.isguangzhu = false;
				return;
			}
			this.isguangzhu = true;
			uni.showToast({
				title: '关注成功'
			});
		},
		imgdetail(index) {
			uni.previewImage({
				current:index,
				urls:this.item.morepic
			})
		}
	},
	components: {
		tagSexAge
	}
};
</script>

<style lang="scss" scoped>
@import '../../common/css/list.scss';
.common-list-r-time {
	padding: 15upx 0;
	color: #ccc!important;
	font-size: 25upx;
	background-color: #fff!important;
}
.common-list-r {
	> view:nth-of-type(1) {
		> view {
			color: #999;
			font-size: 30upx;
			&:first-of-type{
				> view{
					&:last-of-type{
						color: #999;
						background-color: #eeeeee;
						padding: 0 10upx;
						font-size: 26upx;
					}
				}
			}
		}
	}
}
</style>
